
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="w1400">
<div class=" login-sec">
<section class="login-logo">
<div class="login-logo-d">
<h1>AI 디지털교과서 통합지원센터</h1>
</div>
</section>
<section class="login-input">
<div class="login-input-d">
<div class="ID">
<input type="text" class="id" ref="user_id" placeholder="아이디를 입력하세요." v-model="userLogin.user_id"
@keyup.enter="login">
</div>
<div class="PW">
<input type="password" class="password" ref="user_pw" placeholder="비밀번호를 입력하세요."
v-model="userLogin.user_pw" @keyup.enter="login">
</div>
</div>
</section>
<section class="login-checkbox">
<div class="login-checkbox-i">
<input type="checkbox">
<span>
로그인상태 유지
</span>
</div>
<div class="login-checkbox-b">
<router-link :to="{ path: '/userIDsearch.page', query: { mode: 'id' } }">
<button class="login-bu-after">아이디 찾기</button>
</router-link>
<router-link :to="{ path: '/userIDsearch.page', query: { mode: 'pw' } }">
<button class="login-bu-after">비밀번호찾기</button>
</router-link>
<router-link to="/Join.page">
<button>회원가입</button>
</router-link>
</div>
</section>
<div class="flex " style="margin: 1.5rem 0.5rem ;">
<div class="login-checkbox-i">
<input type="checkbox">
<span>
로그인상태 유지
</span>
</div>
<router-link to="/Join.page">
<button style="background-color: rgba(255, 228, 196, 0);">회원가입</button>
</router-link>
</div>
<section class="login-button">
<button @click="login">로그인</button>
</section>
</div>
</div>
<!-- 로그인 모달 회원가입 승인중일때 노출-->
<div class="modal-wrapper" v-if="isVisible">
<div class="modal-container">
<div class="login-modal">
<p class="modal-text">
가입 승인 중인 회원입니다.<br />
회원가입 승인 전까지 특정 서비스는 이용하실 수 없으며,<br />
승인 이후 모든 서비스를 이용하실 수 있습니다.
</p>
<button class="blue-btn small-btn" @click="hideDiv">확인</button>
</div>
</div>
</div>
</template>
<script>
import axios from 'axios';
import crypto from "crypto-js";
import { useStore } from 'vuex';
export default {
data() {
return {
isVisible: false,
userLogin: {
user_id: null,
user_pw: null
},
store: useStore(),
isVisible: false,
};
},
methods: {
hideDiv() {
this.isVisible = false;
},
closeOnEnter(e) {
if (e.key === 'Enter' && this.isVisible) {
this.hideDiv();
}
},
//아스크 변환
asc: function (data) {
let ascii = '';
for (let i = 0; i < data.length; i++) {
ascii += data.charCodeAt(i);
}
console.log('ascii', ascii)
return ascii
},
//로그인
login: function () {
let vm = this;
//Encrypt
// let iv = this.store.state.key.iv;
// var salt = this.store.state.key.salt;
// var passPhrase = this.store.state.key.ENC_KEY;
// console.log('this.asc(iv) - ', this.asc(iv));
// console.log('this.asc(salt) - ', this.asc(salt));
// console.log('this.asc(passPhrase) - ', this.asc(passPhrase));
// var keySize = 128;
// var iterationCount = 1000;
// var key128Bits100Iterations = crypto.PBKDF2(passPhrase, crypto.enc.Hex.parse(salt), { keySize: keySize / 32, iterations: iterationCount });
// var encrypted = CryptoJS.AES.encrypt(
// this.userLogin.user_id = crypto.AES.encrypt(this.userLogin.user_id, key128Bits100Iterations, { iv: crypto.enc.Hex.parse(iv) }).toString();
// this.userLogin.user_pw = crypto.AES.encrypt(this.userLogin.user_pw, key128Bits100Iterations, { iv: crypto.enc.Hex.parse(iv) }).toString();
// let encryptedUserId = crypto.AES.encrypt(this.userLogin.user_id, key128Bits100Iterations, { iv: crypto.enc.Hex.parse(iv) }).toString();
// let encryptedUserPw = crypto.AES.encrypt(this.userLogin.user_pw, key128Bits100Iterations, { iv: crypto.enc.Hex.parse(iv) }).toString();
// var loginData = {
// user_id: encryptedUserId,
// user_pw: encryptedUserPw
// };
axios({
url: '/user/login.json',
method: 'post',
headers: {
'Content-Type': 'application/json; charset=UTF-8'
},
// data: vm.userLogin
data: vm.userLogin
}).then(function (response) {
// console.log("login - response : ", response);
if (response.data.isLoginSuccess == true) {
if (response.data.create_account_approval === 'N') {
vm.$refs['user_pw'].blur();
vm.isVisible = true;
} else {
vm.$router.push({ path: '/', query: {} });
}
} else {
alert('로그인 정보를 다시 확인해주세요.');
vm.$refs['user_id'].focus();
}
}).catch(function (error) {
console.log("login - error : ", error);
});
},
hideDiv: function () {
this.isVisible = false;
this.$router.push({ path: '/', query: {} });
},
},
watch: {},
computed: {},
mounted() {
console.log("login mounted");
window.addEventListener('keyup', this.closeOnEnter);
},
beforeDestroy() {
window.removeEventListener('keyup', this.closeOnEnter);
},
};
</script>